<include file="Public:header" />
<include file="Public:left" />
<style>
    td {
        text-align: center;
    }
</style>
<style type="text/css" src="__STATIC__/admin/css/style.css" ></style>
<style type="text/css" src="__STATIC__/admin/js/laydate/need/laydate.css" ></style>
<script src="__STATIC__/admin/js/laydate/laydate.js"></script>
<section>
    <div class="page_title">
        <h2 class="fl">订单列表</h2>
        <form method="get">
            <input type="text" placeholder="可搜索订单号" name="sn" style="width: 150px;height: 18px;font-size: 11px;line-height: 17px; margin-left: 20px;float: left;margin-top: 10px; " <if condition="isset($_GET['sn'])">value="{$_GET['sn']}"</if>/>
            <input type="text" id="start_date" name="start" placeholder="开始时间" style="width: 150px;height: 18px;font-size: 11px;line-height: 17px; margin-left: 20px;float: left;margin-top: 10px; " <if condition="isset($_GET['start'])">value="{$_GET['start']}"</if>>
            <input type="text" id="end_date" name="end" placeholder="结束时间"  style="width: 150px;height: 18px;font-size: 11px;line-height: 17px; margin-left: 20px;float: left;margin-top: 10px; " <if condition="isset($_GET['end'])">value="{$_GET['end']}"</if>>
            <select name="status">
                <option value="">全部状态</option>
                <option value="0" <if condition="isset($_GET['status']) && $_GET['status'] neq '' && $_GET['status'] eq 0">selected</if>>待付款</option>
                <option value="1" <if condition="isset($_GET['status']) && $_GET['status'] eq 1">selected</if>>已付款</option>
                <option value="2" <if condition="isset($_GET['status']) && $_GET['status'] eq 2">selected</if>>已发货</option>
                <option value="3" <if condition="isset($_GET['status']) && $_GET['status'] eq 3">selected</if>>已完成</option>
            </select>
            <select name="pay_type">
                <option value="">全部状态</option>
                <option value="1" <if condition="isset($_GET['pay_type']) && $_GET['pay_type'] eq 1">selected</if>>线上支付</option>
                <option value="2" <if condition="isset($_GET['pay_type']) && $_GET['pay_type'] eq 2">selected</if>>线下支付</option>
            </select>
            <input type="submit" value="搜索" style="width: 45px; height: 25px;font-size: 11px; text-align: center;line-height: 10px;margin-top: 9px;margin-left: 10px;" />
        </form>
    </div>
    <table class="table">
        <tr>
            <th>订单编号</th>
            <th>总价</th>
            <th>下单时间</th>
            <th>状态</th>
            <th>操作</th>
        </tr>

        <volist name="list" id="vo" key="k">
        <tr>
            <td>{$vo.order_sn}</td>
            <td>{$vo.total_price}</td>
            <td>{$vo.create_time|date="Y-m-d H:i:s",###}</td>
            <td>
                <switch name="vo.order_state">
                    <case value="-1">关闭</case>
                    <case value="0">待付款</case>
                    <case value="1">已付款</case>
                    <case value="2">已发货</case>
                    <case value="3">完成</case>
                </switch>
            </td>
            <td>
                <a href="{:url('Order/det',array('id'=>$vo['order_id']))}" class="inner_btn">查看</a>
                <eq name="$vo.order_state" value="0">
                    <a href="{:url('Order/cancel',array('id'=>$vo['order_id']))}" class="inner_btn">取消订单</a>
                </eq>
                <eq name="$vo.order_state" value="1">
                    <a onclick="sent({$vo['order_id']})" class="inner_btn">发货</a>
                </eq>
            </td>
        </tr>
        </volist>
    </table>
    <div style="position: fixed;top:0;left: 0;width: 100%;height: 100%;bottom: 0;display: none;" id="box">
        <div style="width: 25%;height: 300px;position: absolute;top:50%;margin-top: -150px;left: 50%;margin-left: -12.5%;background: #fff;text-align: center;border-radius: 10px;border:1px solid #bbb">
            <div style="margin-top: 15%"><input type="text" placeholder="快递方式" id="express_type" style="height: 30px;width: 75%"/><br/><br/><br/>
            <input type="text" placeholder="物流单号" id="express_num" style="height: 30px;width: 75%"/></div><br/><br/><br/><br/>
            <input type="hidden" id="order_id">
            <div>
                <input type="button" value="取消" onclick="cancel()" style="width: 100px;height: 40px"/>
                <input type="button" value="确认" onclick="sub()" style="width: 100px;height: 40px"/>
            </div>
        </div>
    </div>
    {$list->render()}
</section>

<!--tabStyle-->
<script>
    $(document).ready(function() {
        //tab
        $(".admin_tab li a").click(function() {
            var liindex = $(".admin_tab li a").index(this);
            $(this).addClass("active").parent().siblings().find("a").removeClass("active");
            $(".admin_tab_cont").eq(liindex).fadeIn(150).siblings(".admin_tab_cont").hide();
        });

        laydate({
            elem: '#start_date', //目标元素。由于laydate.js封装了一个轻量级的选择器引擎，因此elem还允许你传入class、tag但必须按照这种方式 '#id .class'
            format: 'YYYY-MM-DD hh:mm:ss',
            istime: true,
            event: 'focus' //响应事件。如果没有传入event，则按照默认的click
        });
        laydate({
            elem: '#end_date', //目标元素。由于laydate.js封装了一个轻量级的选择器引擎，因此elem还允许你传入class、tag但必须按照这种方式 '#id .class'
            format: 'YYYY-MM-DD hh:mm:ss',
            istime: true,
            event: 'focus' //响应事件。如果没有传入event，则按照默认的click
        });
    });

    function sent($order_id){
        $('#order_id').val($order_id);
        $('#box').show();
    }

    function cancel(){
        $('#box').hide();
        $('#order_id').val('');
        $('#express_type').val('');
        $('#express_num').val('');
    }

    function sub(){
        var order_id = $('#order_id').val();
        var type = $('#express_type').val();
        if(type == '') alert('物流方式不能为空');
        var num = $('#express_num').val();
        if(type == '') alert('物流单号不能为空');
        $.ajax({
            type: "POST",
            url: "{:url('order/sent')}",
            data: {id:order_id,express_type:type, express_num:num},
            dataType: "json",
            success: function(data){
                if(data.error == -1){
                    alert(data.msg);
                    return false;
                }
                alert('发货成功');
                cancel();
            }
        });

    }


</script>

</div>
</section>
</body>

</html>